<template>
<!-- 优惠卷 -->
  <div class="main">
   <header>
      <div class="return" @click="returns">
        <i class="iconfont icon-zuojiantou"></i>
      </div>
      <div class="title">优惠卷</div>
    </header>
    <!-- 选项栏 -->
    <van-tabs
      line-width="50%"
      class="tabs"
      style="height: 51px"
      v-model="active"
    >
      <div class="tabtext">
        <van-tab
          title="商城"
          style="font-size: 16px; text-align: center"
        ></van-tab>
        <van-tab
          title="生活服务"
          style="font-size: 16px; text-align: center"
        ></van-tab>
      </div>
    </van-tabs>

    <!-- 优惠券 -->
    <div class="under">
      <div class="youhui">
        <img :src="youhuiList[0]" alt="" />
        <img :src="youhuiList[1]" alt="" />
        <img :src="youhuiList[2]" alt="" />
        <img :src="youhuiList[3]" alt="" />
      </div>
    </div>
  </div>
</template>

<script>


export default {
  data() {
    return {
      active: "",
      youhuiList: [
        "http://127.0.0.1:3000/shop_img/youhui_1.png",
        "http://127.0.0.1:3000/shop_img/youhui_1.png",
        "http://127.0.0.1:3000/shop_img/youhui_1.png",
        "http://127.0.0.1:3000/shop_img/youhui_1.png",
      ],
    };
  },
  methods:{
   returns(){
       this.$router.push('/my')
   }
  } ,

};
</script>
        
<style scoped lang="less">
 .main {
   background: #ededed;
   height: 1334px;
  font-size: 40px;
  header {
    width: 100%;
    height: 88px;
    background-color: #ff5654;
    display: flex;
    .return {
      margin-left: 20px;
      i {
        color: #fff;
        font-size: 34px;
        line-height: 88px;
      }
    }
    .title {
      padding: 0 270px;
      color: #fff;
      font-size: 36px;
      line-height: 88px;
    }
  }
}
 .van-tabs{
  height: 51px;
  font-size: 40px;
}
.van-tabs__content .tabtext{
  height: 0;
}
.under {

 
  width: 100%;
  .youhui {
    margin-top: -17px;
    margin-left: 64px;
    margin-right: 64px;
    height: 100%;
    img {
      display: inline-block;
      margin-top: 109px;
      margin-left: 5px;
      width: 300px;
      height: 123px;
    }
  }
}
</style>